 /*
 * @description: 抽奖专区(暂时不开发)
 * @Author: along
 * @Date: 2021-06-16
 * @Last Modified by: along
 * @Last Modified time: 2021-06-16
 */
<template>
    <div
        class="LotterylinkActive"
        @click="emitEvent(106)"
        v-if="isLoad"
    >
        <div
            class="__wrap"
            :style="{
                background: `url(https://cdn.zsdx.cn/student-app/images/active-home/lottery-bg.png) center center no-repeat`,
                backgroundSize: 'cover'
            }"
        >
            <img
                src="http://cdn.zsdx.cn/student-app/images/mall/right.gif"
                class="__logo"
            >
            <img
                src="http://cdn.zsdx.cn/student-app/images/mall/left.gif"
                class="__left"
            >
        </div>
    </div>
</template>

<script>
export default {
    name: 'LotterylinkActive',
    props: {
        // baseconfig: {
        //     type: Object,
        //     default: () => {}
        // },
        index: {//存在多个相同组件,查询当前位置
            type: Number,
            default: () => {}
        }
    },
    data () {
        return {
            // rate: '0px 0px 0px 0px',
            isLoad: false
        };
    },
    watch: {
        //圆角单位转换
        // baseconfig:  {
        //     handler: function (val, oldVal) {
        //         let rateValue = val.style.borderRadius;

        //         this.rate = rateValue.replace(/rpx/g, 'px');
        //         this.isLoad = true;
        //     },
        //     deep: true
        // }
    },
    mounted () {
        this.isLoad = true;
        // if(JSON.stringify(this.baseconfig.style) !== '{}') {//回填圆角
        //     let rateValue = this.baseconfig.style.borderRadius;

        //     this.rate = rateValue.replace(/rpx/g, 'px');
        // }

    },
    methods: {
        /**
         * @description 点击组件，向上级传递点击类型
         */
        emitEvent (type) {
            this.$emit('emit', {
                type: type,//组件类型
                index: this.index//组件位置
            });
        }
    }
};
</script>

<style lang="less" scoped>
.LotterylinkActive {
    width: 375px;
    box-sizing: border-box;
    border: 1px #ffffff solid;
    display: flex;
    flex-direction: column;
    align-items: center;
    background: rgba(242, 242, 242, 1);
    .__wrap {
        width: 375px;
        height: 80px;
        box-sizing: border-box;
        position: relative;
        .__logo {
            width: 119px;
            height: 80px;
            position: absolute;
            top: 0px;
            right: 1px;
            z-index: 10;
        }
        .__left {
            width: 92px;
            position: absolute;
            top: 1px;
            left: 5px;
            z-index: 10;
        }
    }
}
</style>